<script lang="ts" setup>
	// #ifdef APP-NVUE
	const domModule = uni.requireNativePlugin('dom')
	domModule.addRule('fontFace', {
		'fontFamily': "Medium",
		'src': "url('https://dushuba.oss-cn-guangzhou.aliyuncs.com/fonts/MiSans-Medium.ttf')"
	});
	// #endif
	const emits = defineEmits(['left', 'rightclick'])
	const props = defineProps({
		isMine: {
			type: Boolean,
			default: false
		},
		customPath: {
			type: String
		},
		title: String,
		sticky: Boolean,
		bgColor: {
			type: String,
			default: "#fff"
		},
		color: {
			type: String,
			default: "#000"
		},

		top: {
			type: [String, Number],
			default: 0
		},
		isWatch: {
			type: Boolean,
			default: false
		}
	})
	//页面回�
	function pageBack() {
		let pages = getCurrentPages();
		console.log(pages)

		if (pages.length === 1) {
			uni.switchTab({ url: '/pages/index/index' })
		} else {
			uni.$to()
		}

	}
	function handlerLeft() {
		// console.log(props.isMine, 'props.isMine', props.isWatch);
		console.log(props.customPath);
		if (props.customPath) {
			uni.$to(props.customPath)
		} else if (props.isMine) {
			uni.reLaunch({
				url: '/pages/client/account/login'
			})
		} else {
			if (props.isWatch) {
				emits('left', () => {
					pageBack();
				})
			} else {
				pageBack()
			}
		}

	}
</script>
<template>
	<view class="app-header" :style="{'background-color':props.bgColor}" :class="{sticky:props.sticky} ">
		<u-status-bar></u-status-bar>
		<view class=" app-header__content">
			<view class="content-slot" @click="handlerLeft()">
				<slot name="left">
					<image src="/static/icon/nav_icon_back@2x.png" style="width: 44rpx;height: 44rpx;">
					</image>
				</slot>
			</view>
			<view class="content-title">
				<slot name="title">
					<text class="content-title__context font-weight-600"
						:style="{'color':props.color}">{{props.title}}</text>
				</slot>
			</view>
			<view class="content-slot" @click="emits('rightclick')">
				<slot name="right"></slot>
			</view>
		</view>
	</view>
</template>


<style lang="scss" scoped>
	.app-header {
		/* #ifdef APP-NVUE */
		width: 750rpx;
		/* #endif */
		/* #ifndef APP-NVUE */
		width: 100vw;
		/* #endif */
		z-index: 9999;

		&.sticky {
			position: fixed;
			left: 0;
			top: 0;
			//background-color: white;
		}


		&__content {
			/* #ifdef APP-NVUE */
			width: 750rpx;
			/* #endif */
			/* #ifndef APP-NVUE */
			width: 100vw;
			/* #endif */
			height: 88rpx;
			display: flex;
			flex-direction: row;
			/* #ifdef APP-NVUE */
			align-items: center;
			justify-content: space-between;
			/* #endif */
			/* #ifndef APP-NVUE */
			align-items: center;
			/* #endif */

			.content-title {
				flex: 1;
				// height: 88rpx;
				display: flex;
				/* #ifdef APP-NVUE */
				flex-direction: row;
				/* #endif */
				align-items: center;
				justify-content: center;

				&__context {
					font-size: 32rpx;
					font-family: Medium;
				}
			}

			.content-slot {
				/* #ifndef APP-NVUE */
				min-width: 88rpx;
				/* #endif */
				display: flex;
				// height: 88rpx;
				align-items: center;
				justify-content: center;
			}
		}

	}
</style>